<template>
    <div class="w-full h-full flex flex-col">
        <div class="w-full flex flex-row justify-between">
            <div class="flex flex-row   w-w1/5">
            </div>
            <el-button type="primary" class=" bg-cmain_hover ml-w10" icon="el-icon-plus"
                @click="action_show_dialog">添加角色</el-button>
        </div>
        <div class="w-full h-full mt-w20 ">
            <el-table :data="s_admin.list_role" stripe style="width: 100%; " height="800">
                <el-table-column type="index" label="序号" min-width="5%">
                </el-table-column>
                <el-table-column prop="sName" label="角色名称" min-width="15%">
                </el-table-column>
                <el-table-column label="菜单权限" min-width="30%">
                    <template slot-scope="scope">
                        <span v-for="(item, index) in scope.row.sInfo" :key="index">{{ item + (index
                            == scope.row.sInfo.length - 1 ? "" : ("，")) }}</span>
                    </template>
                </el-table-column>

                <el-table-column label="操作" min-width="10%">
                    <template slot-scope="scope">
                        <el-button type="text" @click="action_edit_data(scope.row)">
                            编辑
                        </el-button>
                        <el-button type="text" :class="scope.row.iStatus == 0 ? ' text-cmain_shallow' : ' text-calt'" @click="action_operate_role(scope.row)">
                            {{ scope.row.iStatus == 0 ? "解冻" : "冻结" }}
                        </el-button>
                        <el-button type="text" class=" text-cwarn" @click="action_del_role(scope.row)" >
                            删除
                        </el-button>
                    </template>
                </el-table-column>
            </el-table>
        </div>
        <UiDialogAddRole :data="s_admin.m_role" :is_showDialog="dialog_add_role"
            @nydialog_closed="dialog_add_role = false" @nydialog_submit="action_add_role">
        </UiDialogAddRole>
    </div>
</template>

<script src="./Index.ts"></script>
<style src="./Index.less" lang="less" scoped></style>
